<template>
  <van-cell-group v-for="privateMessageVO in privateMessageVOList">
    <van-cell center :title="privateMessageVO.username" :label="privateMessageVO.text"
              @click="toChat(privateMessageVO)">
      <template #icon>
        <van-image round :src="processImageUrl(privateMessageVO.avatarUrl)" width="50" height="50"/>
      </template>
      <template #value>
        {{privateMessageVO.createTime}}
      </template>
    </van-cell>
  </van-cell-group>
</template>

<script setup lang="ts">
import {PrivateMessageVOType} from "../models/privateMessageVO";
import {useRouter} from "vue-router";
import { processImageUrl } from '../utils/imageUtils';

const router = useRouter();

interface PrivateMessageVOListProps {
  privateMessageVOList: PrivateMessageVOType[];
}

defineProps<PrivateMessageVOListProps>();

const toChat = (privateMessageVO) => {
  router.push({
    path: '/chat',
    query: {
      id: privateMessageVO.friendId,
      username: privateMessageVO.username,
      userType: 1
    }
  })
};
</script>

